<template>
	<div>
		<div
			style="margin: 20px 15px; background-color: #ffffff;border: 1px solid #f3f3f3;margin-top: 20px;box-shadow: azure;">
			<div class="cont">
				<span class="name">姓  名</span>
				<span class="num">牛韦</span>
			</div>
			<div class="cont1">
				<span class="name">住院号</span>
				<span class="num">390090</span>
			</div>
		</div>
		<div class="pay">
			<div>住院余额</div>
			<div>¥60.00</div>
		</div>
		<div class="h1">在线充值</div>
		<div class="choose">
			<div class="zoif">500</div>
			<div class="zoi">1000</div>
			<div class="zoi">2000</div>
		</div>
		<div class="choose" style="margin-top: 20px;">
			<div class="zoi">5000</div>
			<div class="zoi">10000</div>
			<div class="zoi">自定义</div>
		</div>
		<div
			style="display: flex;justify-content: flex-end;margin-top: 20px;padding-right: 10px;color: #006EFF;font-size: 14px;">
			<div @click="minutes">充值记录</div>
		</div>
		<div style="margin:20px 10px;">
			<button @click="affirm" style="border: 0;background-color: #006eff;color: #ddecff;font-weight: 400;">确认充值</button>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
	
			}
		},
		methods: {
			minutes() {
				uni.navigateTo({
					url: "../../../hospitalizationServices/pages/charge/minutes"
				})
			},
			affirm() {
				uni.navigateTo({
					url: "../../../hospitalizationServices/pages/charge/affirm"
				})
			},
		}
	}
</script>

<style>
	.pay{
		margin: 20px 15px; 
		background-color: #ffffff;
		border: 1px solid #f3f3f3;
		box-shadow: azure;
		display: flex;
         justify-content: space-between;
		 align-items: center;
		padding: 10px 5px;
		font-size: 14px;
		color: #555555;
	}
	.num{
		margin-left: 10px;
		color: #000;
	}
	.name{
		margin-left: 5px;
		color: #AAAAAA;
	}
	.cont {
		padding: 10px 5px;
		font-size: 14px;
		border-bottom: 1px solid #f5f5f5;
		color: #555555;
	}
	.cont1 {
		padding: 10px 5px;
		font-size: 14px;
		color: #555555;
	}

	.choose {
		display: flex;
	}

	.zoi {
		flex: 1;
		background-color: #f2f2f2;
		color: #5c5c5c;
		line-height: 40px;
		margin: 0 10px;
		text-align: center;
		border-radius: 10px;
	}

	.zoif {
		flex: 1;
		background-color: #e3efff;
		color: #0e75ff;
		border: 1px solid #006eff;
		border-radius: 5px;
		line-height: 40px;
		margin: 0 10px;
		text-align: center;
	}

	.h1 {
		margin: 20px 15px;
		font-family: 'PingFangSC-Medium', 'PingFang SC Medium', 'PingFang SC', sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: 16px;
	}
</style>